* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  body{
    background-color:rgba(29, 29, 32, 1);
    /* background-color: black; */
    min-height: 100vh;
    /* border-right: 3px solid red; */
    /* margin-right: 30px; */
    position: relative;
    /* top: 30px; */
   
  }
  .conettoreVer{
    border-left:  3px solid white;
    /* height: 60vh;
    top: 40vh; */
    height: 74.28vh;
    /* height: 54.28vh; */
    top: 25.72vh;
    position: absolute;
    left: 86.8vw;
  }
  .container-header{
    /* border-right:  1px solid violet; */
    position: relative;
    display: flex;
  }
  /* nav top  */
  .navi{
    display: flex;
  }
  .button{
    /* border: 1px solid white; */
    border: none;
    /* visibility: hidden; */
    display: none;
  }
  ul{
    margin-left:7.03vw;
    /* margin-top: 2.5vw; */
    margin-top: 3.75vh;
    color: rgba(255, 255, 255, 1);
    padding-left: 0;
    font-family: 'Inter' , sans-serif;
    /* font-size: 1.04vw; */
    font-size: 0.937vw;
    line-height: 1.50vw;
    font-weight: 400;
    width: fit-content;
    margin-bottom: 0;
  }

  .filettoNav{
   margin: 0;
   border: 1.2px solid rgb(255, 255, 255, 1);
   visibility: hidden;
  }
  .nav1{
    display: flex;
    align-items: center;
  }
  .nav1:hover .navName{
  transform: translateX(22px);
  transition: 0.3s;
  }
  .nav1:hover .filettoNav{
    visibility: visible;
   width:40px;
   animation-name: filettoNav;
   animation-duration: 0.7s;
  }
  @keyframes filettoNav {
    0%{
      width: 0px;
    }
    100%{
      width: 40px;
    }
  }


  a:hover{
    color: white;
  }
  /* main  */
  .mainUX{
    /* border: 1px solid blue; */
    position: relative;
    /* height: 5700px; */
    height: 296.875vw;
  }
  .mainHome{
    position: absolute;
    width: 100%;
    height: 79vh;
    display: flex;
    align-items: center;
  }
  .mainP{
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .bg-image{
    background-image: url('/images/sfondo-home.svg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    /* height: 33.33vw;
    width: 30.72vw; */
    width: 28.645vw;
    height: 31.093vw;
    display: flex;
    align-items: center;
    /* position: absolute; */
    /* z-index: -1; */
    
  }
  .centered{
    display: flex;
    /* column-gap: 100px; */
    column-gap: 5.20vw;
    font-family:'Major Mono Display' , sans-serif;
    color: rgba(255, 255, 255, 1);
    /* margin-top: 50px; */
    margin-left: -35%;
  }
  .titleSx{
    text-align: left;
    /* font-size: 3.64vw; */
    font-size: 3.38vw;
    line-height: 5.20vw;
    font-weight: 400;
  }
  .titleDx{
    /* font-size: 3.64vw;  */
    font-size: 3.38vw;   
    text-align: right;
    line-height: 5.20vw;
    font-weight: 400;
}
/* naV footer */
.navFooter{
  position: absolute;
  width: 100%;
  /* bottom: 3vh; */
  bottom: 5.55vh;
  display: flex;
  flex-direction: column;
  /* row-gap: 1.04vw; */
  align-items: center;
  color: white;
}
.text{
  display: flex;
  /* column-gap: 3.49vw; */
  column-gap: 2.083vw;
  font-size: 1.04vw;
  /* font-size: 1.85vw; */
}
.buttonUXUI{
  width: 2.083vw;
  height:2.083vw ;
}
.nav2{
  display: flex;
  column-gap: 3vw;
}
.pallina1{
  cursor: pointer;
  background-image: url('/images/pallina.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  /* width: 0.67vw;
  height: 0.67vw; */
  width: 1.56vw;
  height: 1.56vw;
}
.pallina2{
  cursor: pointer;
  background-image: url('/images/pallina.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 1.56vw;
  height: 1.56vw;
}
.pallina1:hover{
  background-image: url('/images/hover-pallina.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  transition: 0.7s;
}
.pallina2:hover{
  background-image: url('/images/hover-pallina.svg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  transition: 0.7s;
}
.foot{
  display: none;
  /* visibility: hidden; */
}
p{
  margin-bottom: 0;
}
/* ABOUTE ME -------------------------- */
.mainAboutMe{
  display: flex;
  justify-content: space-between;
}
.wrapperAboutMe{
  margin-left: 7.03vw;
  margin-top: 5.93vw;
  /* margin-top: 9.5vh; */
  position: relative;
  display: flex;
  flex-direction: column;
  /* row-gap: 3.09vw; */
  row-gap: 5vh;
  width: 45%;
}
.aboutMe h1{
  font-family: 'Major Mono Display' , sans-serif;
  font-size: 3.75vw;
  color: rgba(255, 255, 255, 1);
  margin-bottom: 0;
}
.description h3{
  font-family: 'Inter';
  font-weight: 400;
  font-size: 1.041vw;
  line-height: 1.82vw;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.8);
}
.wrapperImage{
  background-image: url('/images/aboutMe/profilo-ale.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 12.32vw;
  width: 12.32vw;
  /* margin-right: 7.03vw; */
  position: absolute;
  /* left: 78.64vw; */
  right: 7.03vw;
}
.imageAboutMeDesk{
  position:absolute;
  right: 0;
  bottom: 0vh;
  margin-right: 7.03125vw;
  /* width: 14.3229vw;
  height:49.166vw; */
  /* width: 14.3229vw;
  height:87.4074vh;; */
  width: 25.462vh;
  height: 87.4074vh;
}
.conettoreImage{
  border-left: 3px solid white;
  z-index: 3;
  /* height: 796px; */
  /* height: 41.472188vw; */
  /* height: 73.731944vh; */
  height: 73.991944vh;
  position: relative;
  top: 100%;
  /* left: 50%; */
}
.wrapperCirconf{
  width: 100%;
  position: absolute;
  /* bottom: 10.77vh; */
  bottom: 6.058125vw;
  /* bottom: 0; */
  /* margin-top: 3.90vw; */
  height: auto;
  display: flex;
  justify-content: space-between;
}
.conettoreO{
  display: none;
}
.circonfG1{
  margin-left: 7.03vw;
  height: 12.32vw;
  width: 12.32vw;
  border-radius: 100%;
  background-color:rgba(44, 49, 58, 1) ;
  display: flex;
  align-items: center;
  justify-content: center;
}
.circonfP1{
  border: 1px solid transparent;
  width: 3.38vw;
  height: 3.38vw;
  border-radius: 100%;
  background-color: rgba(255, 255, 255, 1);
}
.conettoreP1{
  border-bottom: 3px solid white;
  position: absolute;
  top: 50%;
  width: 74vw;
}
.circonfGdx{
  margin-left: 7.03vw;
  height: 12.32vw;
  width: 12.32vw;
  border-radius: 100%;
  background-color:rgba(44, 49, 58, 1) ;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 7.03vw;
  z-index: -1;
}
.circonfPdx{
  border: 1px solid transparent;
  width: 3.38vw;
  height: 3.38vw;
  border-radius: 100%;
  background-color: rgba(255, 255, 255, 1);
  /* border-right: 3px solid rebeccapurple; */
}
.conettoreDx{
  border-right: 3px solid white;
  position: relative;
  height:  100px;
  bottom: 100%;
  right: 50%;
  /* height: ; */
}
.textA, .nav2A{
  display: flex;
}
.textA {
  /* column-gap: 3.48vw; */
  column-gap: 2.083vw;
  font-family: 'Inter';
  font-size:1.04vw ;
  font-weight: 400;
}
.nav2A{
  column-gap: 3.24vw;
  /* column-gap: 0; */
}
.footAboutMe h3{
  font-family: 'Inter' ,sans-serif;
  font-weight: 100;
  font-size: 0.93vw;
  margin-top: 4.166vw;
  /* margin-top: 6.48vh; */
  /* margin-bottom: 0; */
}
.circonfMd, .imageDx {
  display: none;
}
.wrapperCirconf{
  display: none;
}
/* CONTACT ------------- */

/* Modifiche  */
.imageContactDesk1{
  /* border: 1px solid green; */
  /* width:14.3229vw ;
  height: 49.166vw; */
  margin-right: 7.03125vw;
  width:25.3703vh;
  height: 87.4074vh;
  position: absolute;
  bottom: 0;
  right: 0;
}
.wrapperTestContact{
  display: flex;
  row-gap: 0;
}
.descriptionContact{
  /* margin-top: 10.11vh; */
  margin-top:6.302vw; 
}
.descriptionContact h2 {
  color: rgba(255, 255, 255, 1);
  font-family: 'Inter', sans-serif;
  font-size: 1.04vw;
  font-weight: 700;
  /* margin-bottom: 1vh; */
}
.descriptionContact h3 {
  color: rgba(255, 255, 255, 1);
  font-family: 'Inter', sans-serif;
  font-size: 1.04vw;
  /* line-height: 2.77vw; */
  font-weight: 400;
}
.testoEmail{
  position: relative;
  /* margin-top: 3.35vh; */
  margin-top: 2.083vw;
}
.testoEmail h2 {
  color: rgba(255, 255, 255, 1);
  font-family: 'Inter', sans-serif;
  font-weight:700 ;
  font-size: 1.04vw;
  line-height: 1.822vw;
  margin: 0;
}
.testoEmail h3 {
  color: rgba(255, 255, 255, 1);
  font-family: 'Inter', sans-serif;
  font-weight:400 ;
  font-size: 1.04vw;
  /* margin-top: 1vh; */
  line-height: 1.822vw;
  margin-bottom: 0;
}
.cv{
  display: flex;
  column-gap: 1.04vw;
  margin-top: 2.083vw;
  /* margin-top: 3.35vh; */
  background-color: rgba(29, 29, 32, 1);
  border: none;
  cursor: pointer;
}
.cv h2{
  color: rgba(255, 255, 255, 1);
  font-family: 'Inter', sans-serif;
  font-weight:700 ;
  font-size: 1.04vw;
  margin-bottom: 0;
  align-self: center;
}
.cv img{
  /* align-self: center; */
  width:1.66vw ;
  height: 1.25vw;
}
.wrapperContact{
  z-index: -1;
  /* height: 12.32vw;
  width: 12.32vw; */
  margin-right: 7.03vw;
  /* height: 43.0078vw; */
  height: 76.4583vh;
  display: flex;
  flex-direction: column;
  /* align-content: space-between; */
  justify-content: space-between;
  /* position: absolute; */
  /* left: 78.64vw; */
  /* right: 7.03vw; */
}
.circonfDxCont1{
  /* height: 12.32vw;
  width: 12.32vw; */
  width:24.3981vh;
  height: 24.3981vh;
  border-radius: 100%;
  background-color:rgba(44, 49, 58, 1) ;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  /* z-index: -1; */
}
.circonfDxPCont1{
  border: 1px solid transparent;
  /* width: 3.38vw;
  height: 3.38vw; */
  width: 6.00833vh;
  height: 6.00833vh;
  border-radius: 100%;
  background-color: rgba(255, 255, 255, 1);
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.wrapperCirconfCont{
  position: absolute;
  bottom: 14vh;
  /* bottom: 0; */
}
/* UI PORTAFOLIO ----------------------- */
.wrapperUI1{
  display: flex;
  /* column-gap: 300px; */
}
.wrapperUIsx {
  /* border:  1px solid red; */
  height: fit-content;
  width: fit-content;
  /* margin-top: 7.10vh; */
  margin-top: 4vw;
}
.descriptionExn h1{
  color:rgba(255, 255, 255, 1);
  font-family: 'Major Mono Display' , sans-serif;
  font-size:2.60vw ;
  margin-bottom: 0;
}

.testoRuolo{
  /* margin-top: 3.17vh; */
  margin-top: 2.083vw;
  /* margin-top: 1.85vw; */
  display: flex;
  flex-direction: column;
  /* row-gap:1.11vh ; */
  /* row-gap: 0.62vw; */
}

.testoRuolo h3 {
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 0;
  font-size: 1.04vw;
  line-height: 1.822vw;
  font-family: 'Inter';
  width: 20.6vw;
  font-weight: 400;
}
.testoRuolo h3 span{
  color: rgba(255, 255, 255, 1);
  font-weight: 700;
}
.testoDescrExn{
  color: rgba(255, 255, 255, 0.8);
  /* margin-top: 4vh; */
  margin-top: 4.010vw;
  /* margin-top: 2.25vw; */
}
.testoDescrExn h3{
  font-family: 'Inter', sans-serif;
  font-size: 1.04vw;
  line-height: 1.62vw;
  font-weight: 400;
  margin-bottom: 0;
}
.testoLearn{
  display: flex;
  column-gap: 1.04vw;
  /* margin-top: 3.17vh; */
  margin-top: 2.083vw;
  /* margin-top: 1.85vw; */
}
.testoLearn h2{
  color: rgba(255, 255, 255, 1);
  font-family: 'Inter', sans-serif;
  font-size: 1.04vw;
  font-weight: 700;
  margin-bottom: 0;
}
.imageUI1{
  margin-left: 12vw;
  /* width:47.5vw ; */
  height: 33vw;
  margin-top: 4vw;
  /* margin-top: 3.24vh; */
}
.wrapperImageUI2{
  display: flex;
  justify-content: center;
}
.imageUI2{
  /* border: 1px solid red; */
  position: relative;
  /* top: -7.6vw; */
  top: -13.7vw;
 /* top: -15.5vh; */
  width:71.95vw ;
  height:265vw ;
  right: 2.60vw;
  z-index: -1;
}
.wrapperImageUI3{
  position: absolute;
  /* top: 1985px; */
  top: 93vw;
  /* top: 165.4vh; */
  width: 100%;
  display: flex;
}
.imageUI3{
  margin-left: 10.25vw;
  /* left: 219px; */
  width:45.05vw ;
  height:34.01vw ;
}
.wrapperUI3dx{
  margin-left: 13.81vw;
  width: 20.69vw;
}
.wrapperImageUI4{
  position: absolute;
  top: 160.01vw;
  /* top: 165.4vh; */
  width: 100%;
  display: flex;
}
.wrapperUI4sx{
  margin-left: 7.03vw;
  /* border:  1px solid red; */
  height: fit-content;
  width: 21.17vw;
  align-self: center;
}
.imageUI4{
  margin-left: 10.25vw;
  width:46vw ;
  height:34.01vw ;
}
.wrapperImageUI5{
  position: absolute;
  top: 237.2vw;
  /* top: 165.4vh; */
  width: 100%;
  display: flex;
}
.footerUI{
  color:  white;
  display: flex;
  flex-direction: column;
  /* justify-content: center; */
  align-items: center;
  /* margin-bottom: 3.80vw; */
  margin-bottom: 3.25vw;
}
.footerUI1 h3{
  margin-bottom: 0;
}
/* UIPORTAFOLIO TABLET -------- */
.wrapperUIsx1, .wrapper3CirconfUI2, .wrapper3CirconfUI3, .wrapper3CirconfUI4{
  display: none;
}
/* immaginiNONPresenti */
.mobileImageUI1, .mobileImageUI2, .mobileImageUI3, .mobileImageUI4{
  display: none;
}

/* UX PORTAFOLIO ---------------------------- */

.wrapperSCL{
  margin-left: 7.03vw;
  margin-top: 9.5vh;
  position: relative;
  display: flex;
  flex-direction: column;
}
.wrapperUX1, .testoDescrSCL{
/* margin-top: 3.75vw; */
/* margin-top: 5.208vw; */
margin-top: 4.010vw;
}
.wrapperUXsx{
  width: 27.94vw;
  height: fit-content;
}
.wrapperUXsx .testoRuolo h3{
  width: fit-content;
}
.learnLink{
  display: flex;
  column-gap: 1.041vw;
  text-decoration: none;
}
.imageUX1{
  margin-left: 2.60vw;
  /* width: 53.59vw; */
  /* height: 27.2vw; */
  width: 58.906vw;
  height: 30.156vw;
}
.conettoreSCL{
  border-left: 3px solid white;
  /* height: 385px; */
  position: relative;
  top: 0px;
  /* margin-left: 50vw; */
  margin-left: 14.78vw;
  /* height: 18.05vw; */
  /* height: 209.35vw; */
  height: 206.869146vw;
  /* height: 367.57162vh; */
}
.wrapperSfondoUX{
  display: flex;
  justify-content: center;
  /* height: 250.875vw; */
  /* border: 1px solid red; */
  /* width: 100%; */
  /* width: fit-content; */
}
.sfondoUX{
  /* border: 1px solid red; */
  width: 100%;
  /* width: 100vw; */
  position: relative;
  z-index: -1;
  top: -23.7vw;
}
.wrapperUXcirconf1{
  width: 100%;
  position: absolute;
  top: 60vw;
  z-index: -1;
  display: flex;
}

.UXcirconf1G{
  margin-left: 45.5729vw;
  height: 8.541vw;
  width: 8.541vw;
  border-radius: 100%;
  background-color:rgba(44, 49, 58, 1) ;
  display: flex;
  align-items: center;
  justify-content: center;
}
.UXcirconf1P{
  height: 2.2916vw;
  width: 2.2916vw;
  background-color:rgba(255,255, 255, 1) ;
  border-radius: 100%;
}

.wrapperSID{
  display:  flex;
  position: absolute;
  top: 90.625vw;
  /* top: 95.625vw; */
  /* top: 120.625vw; */
  width: 100%;
  height: fit-content;
}
.imageUX2{
margin-left: 3.645vw;
/* width: 53.59vw;
height: 27.2vw; */
width: 58.906vw;
  height: 30.156vw;
}
.wrapperUXdx{
  margin-left: 2.60vw;
}
.wrapperUXcirconf2{
  width: 100%;
  position: absolute;
  top: 122.75vw;
  z-index: -1;
  display: flex;
}
.UXconettoreO2{
  border-top: 3px solid white;
  align-self: center;
  position: absolute;
  width: 50%;
}
.UXcirconf1G2{
  background-color: rgba(83, 88, 98, 1);
}
.wrapperWorkCloud{
  position: absolute;
  top: 160.5625vw;
  /* top: 191.5625vw; */
  width: 100%;
  display:  flex;
}
.wrapperUXsx1{
  margin-left: 7.03vw;
}
.wrapperUXcirconf3{
  width: 100%;
  position: absolute;
  top: 186.6vw;
  z-index: -1;
  display: flex;
}
.UXconettoreO3{
  border-top: 3px solid white;
  align-self: center;
  position: absolute;
  width: 50%;
  left: 50%;
}
.UXcirconf1G3{
  background-color:rgba(137, 143, 152, 1) ;
}
.wrapperCaseS{
  display:  flex;
  position: absolute;
  top: 231.96875vw;
  /* top: 262.96875vw; */
  width: 100%;
  /* height: fit-content; */
}
.wrapperImageCase{
  display: flex;
  /* flex-direction: column; */
  column-gap:2.391vw;
  margin-left: 7.03vw;
}
.imageCUX1, .imageCUX2, .imageCUX3{
  width:16.3vw;
  height: 27.2vw;;
}
.wrapperUXcirconf4{
  width: 100%;
  position: absolute;
  top: 251.35vw;
  z-index: -1;
  display: flex;
}
.UXcirconf1G4{
  background-color:rgba(154, 165, 179, 1) ;
}
.footerUX{
  position: relative;
  /* margin-top: 15.26vw; */
  color:  white;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* margin-bottom: 3.80vw; */
}
/* CLASSI NON PRESENTI---- */
.wrapperTabUXcircf1, .wrapperTabUXscl, .tabUXDescrscl, .wrapperTabImagescl,
.tabUXTools, .wrapperTabUXcircf2, .wrapperTabUXsid, .wrapperTabUXwork, .wrapperTabCases,
.wrapperTabImageCases{
  display: none;
}

/* PROVAA --------------------*/
.collapse{
  /* visibility: hidden; */
  transition: 0.4s;
}
.card {
  /* border: 1px solid red; */
  /* display: none; */
  position: absolute;
  /* top: 80px; */
  /* top: 10.41vw; */
  z-index: 2;
  width: 100%;
  left: 0;
  /* height: 100vh; */
  /* height: 115.79vw; */
  /* border: 1px solid red; */
  height: 87.37vh;
  background-color: transparent;
  border: none;
}
.card1{
  height: 92.19248vh;
  /* height: 0vh; */
}
.list-responsive{
  /* display: none; */
  visibility: hidden;
}
.wrapperCirconf img{
  display: none;
}
.circonf3UI1{
  /* border: 1px solid blue; */
  height: fit-content;
}

/* sezione responsive tablet  */
@media screen and (max-width:1023px){
  /* modifiche UXPORTFOLIO */
  .wrapperSfondoUX{
    display: none;
  }

  .container-header{
    display: block;
  }
  .conettoreVer{
    display: none;
  }
  .list {
    display: none;
  }
  .list-responsive{
    display: flex;
    flex-direction: column;
    visibility: visible;
    width: 100%;
    height: 100vh;
    margin-left: 0;
    /* align-items: flex-start; */
    /* justify-content: center; */
    /* row-gap: 30px; */
    /* margin-top: 36.9791vw; */
    margin-top: 27.7343vh;
    row-gap: 3.906vw;
    /* margin-top: 0; */
    /* align-items: center; */
  }
  .list-responsive li{
    align-self: center;
    /* justify-content: center; */
    font-family: 'Major Mono Display' , sans-serif;
    /* font-size:28px ; */
  }
  .card{
    /* border: 1px solid red; */
    background-color: rgba(29, 29, 32, 1);
    /* top: 10.41vw; */
    top: 13.020vw;
    padding: 0;
    border:none;

  }
  .navName1{
    font-size: 3.645vw;
  }
  
  .wrapperHeader{
    /* display: block; */
    background-image: url('/images/headerTablet.svg');
    width: 100%;
    height: 13.02vw;
    /* height: 9.765vh; */
    background-repeat: no-repeat;
    background-size: cover;
    /* z-index: 1; */
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .navi{
    /* box-shadow: inset 0px 25px 25px rgba(49, 63, 94, 1);
    display: flex;
    justify-content: center;
    border: 1px solid blue; */
  }
  .button{
    /* visibility: visible; */
    display: block;
    cursor: pointer;
    /* margin-top: 50px; */
    /* margin-top: 6.51vw; */
    background-color: transparent;
    /* height: 30px;
    width: 40px; */
    height: 3.90vw;
    width: 5.20vw;
    position: relative;
    display: flex;
  }
  .icon{
    display: flex;
    flex-direction: column;
    /* row-gap: 6px; */
    row-gap: 0.781vw;
    align-items: center;
    /* width: 28px; */
    width: 3.64vw;
    position: relative;
    margin: auto;
    transition: 0.5s;
  }
  .icon2{
    /* width: 100%; */
    transform: scaleX(1);
    transition: 0.5s;
  }
  .icon1{
    transition: 0.5s;
  }
  .icon3{
    transition: 0.5s;
  }
  .button.active .icon2{
    /* transform: translateY(0); */
    transform: scaleX(0);
  }
  .button.active .icon1{
    /* transform: rotate(-45deg) translate(-6px, 5px); */
     transform: rotate(-45deg) translate(-0.78125vw, 0.651vw);
    transition: 0.5s;
  }
  .button.active .icon3{
    /* transform: rotate(45deg) translate(-6px, -5px); */
    transform: rotate(45deg) translate(-0.78125vw, -0.651vw);
    transition: 0.5s;
  }
  .icon span{
    /* position: absolute; */
    display: block;
    top: 0;
    background-color: white;
    /* height: 2px; */
    height: 0.26vw;
    width: 100%;
    left: 0;
  }
  ul{
    line-height: 3.5vw;
  }
  /* MAIN  */
  .mainHome{
    display: block;
    position: absolute;
    top: 23.33vh;
    height: auto;
  }
  .bg-image{
    width: 65.10vw;
    height: 70.83vw;
    display: flex;
    align-items: flex-start;
  }
  .centered{
    display: flex;
  }
  .titleSx{
    /* font-size: 40px; */
    font-size: 5.20vw;
    width: fit-content;
    /* line-height: 56px; */
    line-height: 7.29vw;
    /* margin-left: 120px; */
    margin-left: 15.625vw;
    margin-top: 0;
  }
  .titleDx {
    font-size: 5.20vw;
    line-height: 7.29vw;
    margin-top: 38%;
    margin-bottom: 0;
    /* margin-left: 50px; */
    margin-left: 6.51vw;
  }
  .navFooter{
    margin-top: 0;
    margin-bottom: 0;
    position: absolute;
    display: flex;
    width: 100%;
    bottom: 7.5vh;
    /* bottom: 10.416vw; */
  }
  .text{
    display: flex;
    /* column-gap: 40px; */
    column-gap: 5.20vw;
    /* font-size: 14px; */
    /* font-size: 1.822vw; */
    font-family: 'Inter' , sans-serif;
    font-weight: 400;
    /* line-height: 35px; */
    /* height: 25px; */
    /* height: 3.255vw; */
  }
  .buttonUXUI{
    width: 5.208vw;
    height: 5.208vw;
  }
  .nav2{
    /* display: flex; */
    /* column-gap: 38px; */
    column-gap: 4.947vw;
  }
  .pallina1 , .pallina2{
    /* width: 20px;
    height: 20px; */
    width: 2.60vw;
    height: 2.60vw;
  }
  .foot{
    display: block;
    text-align: center;
    margin-top: 2.92vh;
  }
  .foot h3{
    font-size: 1.30vw;
    font-family: 'Inter' , sans-serif;
    font-weight: 100;
    margin-bottom: 0;
  }
  /* About ME  ------------------------------*/
  /* Modifiche  */
  .imageAboutMeDesk{
    display: none;
  }
  .wrapperImage{
    display: none;
  }
  .wrapperAboutMe{
    width: 100%;
    align-items: center;
    /* justify-content: center; */
    margin: 5.20VW 11.45vw 0 11.45vw;
    /* display: flex; */
    row-gap: 16.145vw;
    /* row-gap:12.10vh ; */
    /* margin: 0; */
  }
  .aboutMe h1{
    font-size: 5.20vw;
  }
  .description h3 {
    font-size: 2.34vw;
    line-height: 3.90vw;
  }
  .wrapperCirconf{
    position: absolute;
    /* top: 0; */
    bottom: 18.75vh;
  }
  .circonfG1{
    margin-left:11.45vw ;
    width:20.18vw ;
    height:20.18vw ;
  }
  .conettoreO{
    display: block;
    border-top: 2px solid white;
    position: absolute;
    /* top: 50%; */
    width: 100vw;

  }
  .circonfGdx{
    width:20.18vw ;
    height:20.18vw ;
  }
  .imageDx{
    display: block;
    background-image: url('/images/aboutMe/profilo-ale.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:20.18vw ;
    height:20.18vw ;
    margin-right: 11.45vw ;
    z-index: 1;
  }
  .conettoreP1{
    display: none;
    /* width: 79.67vw; */
  }
  .textA, .nav2A{
    display: none;
  } 
  .footAboutMe h3{
    font-size: 1.30vw;
    /* line-height: 1.55vw; */
    width: 21.354vw;
    text-align: center;
    margin: 0;
  }
  .wrapperCirconf{
    display: flex;
    align-items: center;
  }

  /* CONTACT -------------------------- */
  
  /* Modifiche  */
  /* ClassiNONDESKPRESENTI */
  .imageContactDesk1{
    display: none;
  }
  .wrapperContact{
    display: none;
  }
  .wrapperTestContact{
    display: flex;
    /* align-items: flex-start; */
    row-gap: 0;
  }
  .descriptionContact{
    position: relative;
    /* margin-top:11.91vh; */
    margin-top: 15.755vw;
  }
  .descriptionContact br {
    display: none;
  }
  .descriptionContact h2 {
    margin-bottom: 0;
    color: rgba(255, 255, 255, 1);
    font-family: 'Inter', sans-serif;
    font-size:2.21vw ;
    font-weight: 700;
  }
  .descriptionContact h3 {
    margin-bottom: 0;
    margin-top:1vw ;
    color: rgba(255, 255, 255, 0.8);
    font-family: 'Inter', sans-serif;
    font-size:2.21vw ;
    line-height: 3.90vw;
    font-weight: 400;
  }
  .testoEmail{
    margin-top: 2.92vh;
    /* line-height: 30px; */
  }
  .testoEmail, .cv{
    align-self: flex-start;
    /* margin: 0; */
  }
  .testoEmail h2 {
    font-size:2.21vw ;
  }
  .testoEmail h3{
    font-size:2.21vw ;
    line-height: 3.90vw;
    color: rgba(255, 255, 255, 0.8);
    margin-top: 1vw;
  }
  .cv{
    column-gap: 1.82vw;
    margin-top: 2.92vh;
  }
  .cv h2{
    font-size:2.21vw ;
  }
  .cv img{
    width: 2.99vw;
    height: 2.21vw;
  }
  .circonfGdxContact{
    display: none;
  }
  .wrapperCirconf img {
    display: block;

    width:67.70vw ;
    height: 36.19vw;
  }
  .wrapperCirconfCont{
    /* border: 1px solid violet; */
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: 10.86vh;
    /* bottom: 0; */
  }
  .footerUX {
    display: block;
  }

  /* UI PORTAFOLIO---------------------- */
  .wrapperUI0{
    /* margin: 8.5vw 0 0 0; */
    margin: 18.229vw 0 0 0;
  }
  .wrapperUIsx, .wrapperImageUI3, .wrapperImageUI2, .wrapperImageUI4, .wrapperImageUI5{
    display: none;
  }
  .wrapperUI1{
    margin-top: 4.55vw;
  }
  .circonf3UI1{
    display: flex;
    background-image: url('/images/UI/circonf3UI1.svg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:85.28vw ;
    height:89.61vw ;
    align-items: center;
    justify-content: center;
  }
  .imageUI1{
    width:69.01vw ;
    height:46.74vw ;
    margin: 0;
  }
  .wrapperUIsx1{
    width:85.28vw;
    display: flex;
    flex-direction: column;
  }
  .wrapperUIsx1 .descriptionExn h1{
    font-size: 5.07vw;
    /* align-self: center; */
    justify-content: center;
    text-align: center;
  }
  .wrapperUIsx1 .testoRuolo {
    margin-top: 5.73vw;
    row-gap: 1.95vw;
  }
  .togliere{
    display: none;
    /* animation-name: toglieSmoot;
    animation-duration: 0.5s; */
  }
  .footerUITab{
    margin: 0;
    position: absolute;
    z-index: 3;
    bottom: 2.7vh;
    /* margin-left:  39.322vw; */
    display: flex;
    width: 100%;
    /* align-items: center; */
    /* justify-content: center; */
    /* text-align: center; */
  }
  .smoot{
    transition: 2s;
  }


  .wrapperUIsx1 .testoRuolo h3 {
    font-size: 2.21vw;
    /* line-height: ; */
    width: fit-content;
  }
  .wrapperUIsx1 .testoDescrExn {
    margin-top: 3.90vw;
    /* margin: 0; */
  }
  .wrapperUIsx1 .testoDescrExn h3 {
    font-size: 2.21vw;
    line-height:3.90vw ;
  }
  .wrapperUIsx1 .testoLearn {
    /* margin-top: 3.90vw; */
    margin-top: 3.90vw;
    column-gap: 2.60vw;
  }
  .wrapperUIsx1 .testoLearn h2{
    font-size:2.21vw ;
  }
  .wrapper3CirconfUI2{
    margin-top: 13.02vw;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .circonf3UI2{
    display: flex;
    background-image: url('/images/UI/circonf3UI2.svg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:72.91vw ;
    height:96.09vw ;
    align-items: center;
    justify-content: center;
  }
  .imageUI2{
    position: relative;
    top: 0;
    left: 0;
    width: 70.96vw;
    height: 53.51vw;
    margin: 0;
    z-index: 2;
  }
  .wrapperTestUI2{
    margin-top: 7.81vw;
  }
  .testoDescrExnUI2{
    width: 76.59vw;
  }
  .wrapper3CirconfUI3{
    margin-top: 16.66vw;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .circonf3UI3{
    display: flex;
    background-image: url('/images/UI/circonf3UI3.svg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:71.97vw ;
    height:112.23vw ;
    align-items: center;
    justify-content: center;
  }
  .imageUI3{
    position: relative;
    top: 0;
    left: 0;
    width: 73.17vw;
    height: 56.77vw;
    margin: 0;
  }
  .wrapperTestUI3{
    margin-top: 5.85vw;
  }
  .wrapper3CirconfUI4{
    margin-top: 9.37vw;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .circonf3UI4{
    display: flex;
    background-image: url('/images/UI/circonf3UI4.svg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width:67.07vw ;
    height:111.97vw ;
    align-items: center;
    justify-content: center;
  }
  .imageUI4{
    position: relative;
    top: 0;
    left: 0;
    width: 74.73vw;
    height: 58.85vw;
    margin: 0;
  }
  .footerUI{
    margin-top: 26.04vw;
  }
  /* immaginiNONPresenti ----*/
  .mobileImageUI1, .mobileImageUI2{
    display: none;
  }
  /* UXPORTAFOLIO ---------- */
  .menuFisso{
    /* height: 13.020vw; */
    position: fixed;
    top: 0;
    /* position: absolute; */
    width: 100%;
    background-color: rgba(29, 29, 32, 1);
    z-index: 3;
  }
  .wrapperSCL{
    display: flex;
    margin-top: 18.229vw;
    margin-left: 0;
  }
  .titoloUX{
    align-self: center;
  }
  .titoloUX h1{
    font-size: 5.20vw;
  }
  .wrapperTabUXcircf1{
    display: block;
    margin-top: 9.24vw;
  }
  .tabUXcircf1G{
    margin-left: 3.90vw;
    height: 12.76vw;
    width: 12.76vw;
    border-radius: 100%;
    background-color:rgba(83, 88, 98, 1) ;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .tabUXcircf1P{
    height: 3.38vw;
    width: 3.38vw;
    background-color:rgba(255,255, 255, 1) ;
    border-radius: 100%;
    display: flex;
    justify-content: center;
  }
  .tabConettorePrin{
    border-right: 2px solid white;
    /* height: 582.942vw; */
    height: 596.635vw;
    position: relative;
    /* right: 47%; */
    top: 100%;
  }
  .wrapperTabUXscl{
    margin-top: 4.42vw;
    background-color: rgba(44, 49, 58, 1);
    width: 90.885VW;
    height: 15.755VW;
    display: block;
    border-radius: 0px 7.94vw 7.94vw 0px;
    display: flex;
    align-items: center;
    position: relative;
  }
  .wrapperTabUXscl h1{
    margin-left: 21.22vw;
    color: rgba(255, 255, 255, 1);
    font-family: 'Major Mono Display' , sans-serif;
    font-size: 5.20vw;
    margin-bottom: 0;
  }
  .tabUXDescrscl{
    display: block;
    margin-top: 7.16vw;
  }
  .tabUXDescrscl h3{
    margin-left: 21.22vw;
    color: rgba(255, 255, 255, 0.8);
    font-family: 'Inter', sans-serif;
    font-size: 2.21vw;
    line-height: 3.77vw;
    width: 69.66vw;
    margin-bottom: 0;
  }
  .wrapperTabImagescl{
    display: block;
    margin-top: 7.16vw;
  }
  .tabImageSCL{
    margin-left: 20.5vw;
    width: 63.28vw;
    height: 31.51vw;
  }
  .tabUXTools{
    display: flex;
    flex-direction: column;
    row-gap: 3.90vw;
    color: white;
    margin-top:7.16vw ;
    margin-left: 21.22vw;
    width: 63.28vw;
  }
  .tabUXTools h3{
    margin-bottom: 0;
    font-family: 'Inter', sans-serif;
    font-size: 2.21vw;
    line-height: 3.906vw;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.8);
  }
  .tabUXTools span{
    color: rgba(255, 255, 255, 1);
    font-weight: 900;
  }
  .tabUXTools .testoLearn{
    margin: 0;
    display: flex;
    column-gap: 2.60vw;
  }
  .tabUXTools .testoLearn h2{
    font-size: 2.21vw;
  }
  .wrapperTabUXcircf2{
    display: block;
    display: flex;
    /* flex-direction: column; */
    align-items: center;
    margin-top: 8.07vw;
  }
  .tabConettoreC2{
    border-top: 2px solid white;
    /* align-self: center; */
    /* justify-self: center; */
    position: absolute;
    /* top: 47%; */
    /* top: 50%; */
    /* left: 50%; */
    margin-left: 8.5937vw;
    width: 91.4063vw;
  }
  .wrapperTabUXsid{
    margin-top: 13.02vw;
    background-color: rgba(83, 88, 98, 1);
    width: 90.885VW;
    height: 15.755VW;
    display: block;
    border-radius: 0px 7.94vw 7.94vw 0px;
    display: flex;
    align-items: center;
    position: relative;
  }
  .wrapperTabUXsid h1{
    margin-left: 21.22vw;
    color: rgba(255, 255, 255, 1);
    font-family: 'Major Mono Display' , sans-serif;
    font-size: 5.20vw;
    margin-bottom: 0;
  }
  .tabUXcircf1G3, .wrapperTabUXwork{
    background-color:rgba(137, 143, 152, 1) ;
    /* width: 10px; */
  }
  .tabUXcircf1G4, .wrapperTabCases{
    background-color:rgba(154, 165, 179, 1) ;
    /* width: 10px; */
  }
  .wrapperTabImageCases{
    display: flex;
    column-gap:  2.604vw;
    margin-left: 20.5vw;
  }
  .wrapperTabImageCases img{
    /* margin-left: 20.5vw; */
    width: 19.27vw;
    height: 32.552vw;
  }
  .footerUX{
    margin-top: 26.171vw;
  }

  /* NONPRESENTI--- */
  .wrapperUXcirconf1, .wrapperUX1, .wrapperSID, .wrapperUXcirconf2,
  .wrapperWorkCloud, .wrapperUXcirconf3, .wrapperCaseS, .wrapperUXcirconf4{
    display: none;
  }
}
  /* sezione responsive cellulare 710 */
  @media screen and (max-width:600px) {
    .list-responsive{
      margin-top: 27.3696vh;
    }

    .card{
      position: absolute;
      /* top: 0;  */
      /* top: 18.1vw; */
      top: 25.641vw;
      /* height: 85.18vh */
      height: 85.68vh;
      padding: 0;
    }
    .card1{
      /* border: 1px solid blue; */
      height:91.62772vh;
    }
    .navName1{
      font-size: 5.128vw;
      line-height: 6.153vw;
    }
    .wrapperHeader{
      height: 25.641vw;
    }
    .button{
      /* margin-top:11.53vw ; */
      /* height: 26px;
      width: 38px; */
      height: 6.66vw;
      width: 9.74vw;
    }
    .icon{
      width: 7.692vw;
      row-gap: 1.282vw;
    }
    .icon span{
      /* position: absolute; */
      display: block;
      top: 0;
      background-color: white;
      display: flex;
      flex-direction: column;
      /* height: 2px; */
      height: 0.712vw;
      width: 100%;
      left: 0;
    }
    .button.active .icon1{
      /* transform: rotate(-45deg) translate(-6px, 5px); */
       transform: rotate(-45deg) translate(-1.538vw, 1.282vw);
      transition: 0.5s;
    }
    .button.active .icon3{
      /* transform: rotate(45deg) translate(-6px, -5px); */
      transform: rotate(45deg) translate(-1.538vw, -1.282vw);
      transition: 0.5s;
    }



    .mainHome{
      display: block;
    position: absolute;
    top: 35.78vh;
    /* top: 23.33vh; */
    height: auto;
    }
    .bg-image{
      width: 56.41vw;
      height: 61.53vw;
      /* width: 220px;
      height: 240px; */
    }
    .titleSx{
      font-size: 7.98vw ;
      line-height: 10.5vw;
      margin-left: 0px;
      /* margin-left: 50px; */
      margin-left: 11.28vw;
      margin-top: -40%;
    }
    .titleDx {
      font-size: 7.98vw ;
      line-height: 10.5vw;
      margin-top: 50%;
      /* margin-left: -80px; */
      margin-left: -20.51vw;
      /* margin-left: 0; */
    }
    .centered{
      column-gap: 0;
    }
    .buttonUXUI{
      width: 10.256vw;
      height: 10.256vw;
    }
    /* Abaout ME ------------------- */
    .wrapperAboutMe{
      row-gap:5.68vh ;
    }
    .aboutMe h1{
      font-size: 7.692vw;
    }
    .description h3{
      font-size: 3.58vw;
      line-height:2.36vh ;
    }
    .wrapperCirconf{
      bottom: 24.25vh;
    }
    .text{
      column-gap: 10.25vw;
    }
    .navFooter{
      /* margin-top: 20vh; */
      position: absolute;
      display: flex;
      width: 100%;
      bottom: 8.1vh;
      /* bottom: 17.69vw; */
    }
    .foot{
      /* margin-top: 20px; */
      margin-top: 0;
      /* margin-top: 4.62vh; */
    }
    .foot h3{
      margin-bottom: 0;
      margin-top: 3.55vh;
    }
    .footerAbout{
      bottom: 1vh;
    }
    .footAboutMe h3{
      font-size: 2.80vw;
  
      width: 47.67vw;
      text-align: center;
      margin: 0;
    }
    .text{
      font-size: 3.58vw;
    }
    .nav2{
      margin-top: 2.564vw;
      column-gap: 4.5vw;
    }
    .pallina1{
      width: 5.12vw;
      height: 5.12vw;
    }
    .pallina2{
      width: 5.12vw;
      height: 5.12vw;
    }
    .foot h3{
      font-size: 2.56vw;
    }
    /* CONTACT ------------------- */
    .wrapperTestContact{
      row-gap: 0;
    }
    .descriptionContact{
      margin-top: 5.80vh;
    }
    .descriptionContact h2{
      font-size: 3.59vw;
    }
    .testoEmail h2{
      font-size: 3.59vw;
    }
    .testoEmail h3{
      font-size: 3.59vw;
      line-height: 2.56vh;
    }
    .cv {
      column-gap: 2.56vw;
    }
    .cv h2 {
      font-size: 3.59vw;
    }
    .cv img {
      width: 5.89vw;
      height:4.35vw ;
    }
    .wrapperCirconfCont {
      bottom:21.68vh ;
    }
    .wrapperCirconf img {
      width: 76.92vw;
      height: 41.02vw;
    }

    /* UI PORTAFOLIO ------------------------- */
    .imageUI1{
      display: none;
    }
    
    .wrapperUI0{
      margin-top: 31.794vw;
    }
    .wrapperUI1{
      margin-top: 14.10vw;
    }
    .circonf3UI1{
      /* border: 1px solid blue; */
      display: flex;
      background-image: url('/images/UI/mobile3Circonf1.svg');
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      width:82.05128vw ;
      height:119.2307vw ;
      align-items: center;
      justify-content: center;
    }
    .mobileImageUI1{
      display: block;
      width:80.07vw ;
      height:51.02vw ;
      margin: 0;
      margin-top: -25.64vw;
    }
    .wrapperUIsx1 .testoRuolo{
      row-gap: 0px;
    }
    .wrapperUIsx1 .testoRuolo h3{
      font-size: 3.58vw;
      line-height:6.5vw ;
    }
    .wrapperUIsx1 .testoDescrExn{
      margin-top: 6.15vw;
    }
    .wrapperUIsx1 .testoDescrExn h3 {
      font-size: 3.58vw;
      line-height: 5.12vw;
    }
    .wrapperUIsx1 .testoLearn{
      margin-top: 6.15vw;
    }
    .wrapperUIsx1 .testoLearn h2{
      font-size: 3.58vw;
    }
    .wrapperUIsx1 .testoLearn img{
      width:5.89vw ;
      height:4.35vw ;
    }
    .wrapper3CirconfUI2{
      margin-top: 25.64vw;
    }
    .circonf3UI2{
      background-image: url('/images/UI/mobile3Circonf2.svg');
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      width:88.97vw ;
      height:123.58vw ;
    }
    .mobileImageUI2{
      display: block;
      width:87.07vw ;
      height:59.02vw ;
      margin: 0;
      margin-top: -19.64vw;
    }
    .wrapperTestUI2{
      margin-top: 16.92vw;
    }
    .wrapperTestUI2 .descriptionExn h1{
      font-size: 7.69vw;
    }
    .wrapper3CirconfUI3{
      margin-top: 25.64vw;
    }
    .circonf3UI3{
      background-image: url('/images/UI/sfondoMobileEOP1.png');
      /* background-image: url('/images/UI/circonf3UI3.svg'); */
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      width:86.41vw ;
      height:132.82vw;
      /* align-self:flex-start; */
      margin-left: 13px;
      /* border: 1px solid red; */
    }
    .mobileImageUI3{
      display: block;
      width:79.07vw ;
      height: 52.02vw;
    }
    .wrapperTestUI3 .descriptionExn h1{
      font-size: 7.69vw;
    }
    .wrapper3CirconfUI4{
      margin-top: 25.65vw;
    }
    .circonf3UI4{
      background-image: url('/images/UI/mobile3Circonf4.svg');
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
      width:86.92vw ;
      height:124.10vw ;
    }
    .mobileImageUI4{
      display: block;
      width:89.07vw ;
      height: 52.02vw;
    }
    .wrapperUIsx1 .descriptionExn h1{
      font-size: 7.43vw;
    }
    .footerUI{
      margin-top: 38.46vw;
    }

    /* UX PORTAFOLIO---- */
    .wrapperSCL{
      /* border: 1px solid red; */
      display: flex;
      margin-top: 31.794vw;
      margin-left: 0;
    }
    .menuFisso{
      /* border: 1px solid red; */
      height: 25.641vw;
      position: fixed;
      top: 0;
      /* position: absolute; */
      width: 100%;
      background-color: rgba(29, 29, 32, 1);
      z-index: 3;
    }
    .titoloUX h1{
      font-size: 8.205vw;
    }
    .wrapperTabUXcircf1{
      margin-top: 11.538vw;
    }
    .tabUXcircf1G{
      margin-left: 7.692vw;
      width: 15.384vw;
      height: 15.384vw;
    }
    .tabConettorePrin{
      height: 987.6153vw;
      /* height: 445.7345vh; */
    }
    .wrapperTabUXscl{
      margin-top: 7.692vw;
      width: 94.871vw;
      height: 20.512vw;
      border-radius: 0px 12.205vw 12.205vw 0px;
    }
    .wrapperTabUXscl h1{
      font-size: 6.41vw;
      margin-left: 27.94vw;
    }
    .tabUXDescrscl{
      margin-top:  8.974vw;
    }
    .tabUXDescrscl h3{
      margin-left: 27.94vw;
      font-size:3.589vw;
      line-height: 5.128vw;
      width: 63.333vw;
    }
    .wrapperTabImagescl{
      margin-top: 8.974vw;
      display: flex;
      z-index:1;
      width: 100%;
      align-items: center;
      justify-content: center;
    }
    .wrapperTabImagescl img{
      width: 92.30vw;
      height: 46.15vw;
      margin: 0;
    }
    .tabUXTools{
      margin-left: 27.94vw;
      margin-top:8.974vw ;
      row-gap: 0;
    }
    .tabUXTools h3{
      font-size:3.589vw;
      line-height: 6.5vw;
      /* width: fit-content; */
      margin-top:3.846vw ;
    }
    .tabUXTools .testoLearn{
      margin-top: 7.692vw;
    }
    .tabUXTools .testoLearn h2{
      /* margin-top:7.692vw ; */
      font-size: 3.589vw;
    }
    .testoLearn{
      display: flex;
      align-items: center;
    }
    .testoLearn img{
      /* margin-top:7.692vw ; */
      width:6.41vw ;
      height: 4.87vw;
    }
    .wrapperTabUXcircf2{
      margin-top: 18.205vw;
    }
    .tabUXcircf1P{
      width: 3.8461vw;
      height: 3.8461vw;
    }
    .wrapperTabImagescl{
      margin-left: 0;
    }
    .tabConettoreC2{
      margin-left:13.8461vw;
      width: 86.1539vw;
    }
    .wrapperTabUXsid{
      margin-top: 30.769vw;
      width: 94.871vw;
      height: 20.512vw;
      border-radius: 0px 12.205vw 12.205vw 0px;
    }
    .wrapperTabUXsid h1{
      font-size: 6.41vw;
      margin-left: 27.94vw;
    }
    .wrapperTabImageCases img{
      width:26.641vw ;
      height:43.333vw ;
    }
    .tabUXTools h3:first-child{
      margin-top: 0;
    }
    .mobileTestoLearn{
      display: flex;
      flex-direction: column;
    }
    .mobileTestoLearn h2{
      line-height: 6.410vw;
    }
    .mobileTestoLearn img {
      margin-top: -5.128vw;
    }
    .footerUX {
      margin-top: 33.333vw;
    }

    /* ImmaginiNONPresenti ---- */
    .imageUI2, .imageUI3, .imageUI4{
      display: none;
    }
  }
  @media screen and (max-height:595px) {
    .wrapperHeader{
      position: fixed;
      z-index: 2;
    }
    .mainHome{
      position: relative;
      top: 16.824vw;
      /* top: 36.410vh; */
      /* top: 61.538vh; */
      /* top: 28.436vw; */
    }
    .card{
      height: 71.823vh;
      /* height: 100vh; */
      /* height: 33.1887441vw; */
      /* border: 1px solid red; */
    }
    .list-responsive{
      margin-top: 0;
      justify-content: center;
      row-gap: 1.86vw;
      /* row-gap: 0; */
    }
    .navName1 {
      font-size: 2.36vw;
      /* line-height:2.84vw ; */
    }
    .navFooter{
      position: relative;
      /* bottom: 0; */
      top: 23.77vw;
      /* margin-bottom: 20px; */
    }
    .buttonUXUI{
      margin-bottom: 7.692vh;
    }
    .footerUITab{
      margin: 0;
      position: absolute;
      z-index: 3;
      bottom: 2vh;
      /* margin-left: 39.322vw; */
    }
    .bg-image {
      /* width: 65.49vw;
      height: 71.09vw; */
      width: 59.47vw;
      height: 64.69vw;
    }
    .titleSx{
      margin-top: 0;
      /* font-size: 5.20vw;
      line-height: 7.29vw; */
      font-size: 4.73vw;
      line-height: 6.63vw;
    }
    .titleDx{
      font-size: 4.73vw;
      line-height: 6.63vw;
      margin-left: 12.44vw;
      margin-top: 40%;
    }
    .centered{
      display: flex;
      flex-direction: row;
      /* column-gap: 100px; */
    }
    .button{
      /* visibility: visible; */
      display: block;
      cursor: pointer;
      /* margin-top: 50px; */
      /* margin-top: 6.51vw; */
      background-color: transparent;
      /* height: 30px;
      width: 40px; */
      height: 3.90vw;
      width: 5.20vw;
      position: relative;
      display: flex;
    }
    .icon{
      display: flex;
      flex-direction: column;
      /* row-gap: 6px; */
      row-gap: 0.781vw;
      align-items: center;
      /* width: 28px; */
      width: 3.64vw;
      position: relative;
      margin: auto;
      transition: 0.5s;
    }
    .icon2{
      /* width: 100%; */
      transform: scaleX(1);
      transition: 0.5s;
    }
    .icon1{
      transition: 0.5s;
    }
    .icon3{
      transition: 0.5s;
    }
    .button.active .icon2{
      /* transform: translateY(0); */
      transform: scaleX(0);
    }
    .button.active .icon1{
      /* transform: rotate(-45deg) translate(-6px, 5px); */
       transform: rotate(-45deg) translate(-0.78125vw, 0.651vw);
      transition: 0.5s;
    }
    .button.active .icon3{
      /* transform: rotate(45deg) translate(-6px, -5px); */
      transform: rotate(45deg) translate(-0.78125vw, -0.651vw);
      transition: 0.5s;
    }
    .icon span{
      /* position: absolute; */
      display: block;
      top: 0;
      background-color: white;
      /* height: 2px; */
      height: 0.26vw;
      width: 100%;
      left: 0;
    }
    .nav2{
      /* display: flex; */
      /* column-gap: 38px; */
      column-gap: 4.947vw;
      margin-top: 0;
    }
    .pallina1 , .pallina2{
      /* width: 20px;
      height: 20px; */
      width: 2.60vw;
      height: 2.60vw;
    }
    .foot{
      display: block;
      text-align: center;
      margin-top: 2.92vh;
    }
    .foot h3{
      font-size: 1.30vw;
      font-family: 'Inter' , sans-serif;
      font-weight: 100;
      margin-bottom: 0;
    }
    main{
      margin-top: 20.14vw;
    }
    
    .wrapperTextNav1{
      display: none;
    }

    .footerUITabHome{
      margin: 0;
      /* position: absolute; */
      z-index: 3;
      /* bottom: 0vh; */
      display: flex;
      width: 100%;
      top:65vh;
    }
    /* About ME ------------------- */
    .card{
      /* border: 1px solid red; */
      /* height: 164vh; */
      /* height: 88.7vw; */
      padding: 0;
    }
    .list-responsive{
      height: 88.7vw;
    }
    .mainAboutMe{
      margin-top: 0;
    }
    .mainAboutMe1{
      margin-top: 31.282vh;
      /* margin-top: 14.454vw; */
      /* border: 1px solid blue; */
    }
    .cardAboutMe{
      /* border: 1px solid red; */
      /* background-color: transparent; */
      /* top: 28.1761vh; */
      top: 12.90vw;
     /* top: 109px; */
      /* position: relative;
      width: 100vw; */
    }
    .wrapperCirconf{
      position: relative;
      top: 8.29vw;
      bottom: 0;
      /* margin-bottom: 23.1042vw; */
      margin-bottom: 50vh;
    }
    .footerAbout{
      /* height: 12vh; */
      margin-top: 0;
      position: relative;
      /* position: absolute; */
      /* top: 40vh; */
      top: 16.58vw;
    }
  }